<template>
  <el-dialog
      title="新增物流路线"
      width="500px"
      @close="cancel"
      :close-on-click-modal="false"
      :visible.sync="visible">
    <el-form :model="form" :rules="rules" ref="Form" label-width="120px" hide-required-asterisk>
      <el-form-item label="起始网点:" prop="beginUserId">
        <search-select-all v-model="form.beginUserId" @get="getBeginSite"/>
      </el-form-item>
      <el-form-item label="到达网点:" prop="endUserId">
        <search-select-all v-model="form.endUserId" @get="getEndSite"/>
      </el-form-item>
      <el-form-item label="物流时间" prop="time">
        <el-input-number v-model="form.time" controls-position="right" :precision="0" :min="0"/>
      </el-form-item>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button @click="visible = false">取 消</el-button>
      <submit-button ref="Submit" @submit='submit'/>
    </div>
  </el-dialog>
</template>

<script>
  import {addPathPlanningApi} from '@/api/site/route'
  import {resetForm} from "@/utils/common";
  import SearchSelectAll from '@/views/components/SearchSelectAll'

  export default {
    name: "Add",
    components: {SearchSelectAll},
    data() {
      return {
        visible: false,
        form: {
          beginUserId: null,
          beginUserName: '',
          endUserId: null,
          endUserName: '',
          time: 0
        },
        rules: {
          beginUserId: {required: true, message: '请选择发出网点', trigger: 'change'},
          endUserId: {required: true, message: '请选择到达网点', trigger: 'change'},
          time: {required: true, message: '请输入物流时间', trigger: 'change'}
        }
      }
    },
    methods: {
      // 选择起始网点
      getBeginSite(obj) {
        if (obj) this.form.beginUserName = obj.name;
        else this.form.beginUserName = '';
      },
      // 选择到达网点
      getEndSite(obj) {
        if (obj) this.form.endUserName = obj.name;
        else this.form.endUserName = '';
      },
      submit() {
        this.$refs['Form'].validate((valid) => {
          if (!valid) return false;
          let data = {...this.form};
          this.$refs.Submit.start();
          addPathPlanningApi(data).then(() => {
            this.$refs.Submit.stop();
            this.$emit('update');
            this.cancel()
          }).catch(() => {
            this.$refs.Submit.stop();
          });
        });
      },
      cancel() {
        resetForm(this)
      }
    }
  }
</script>
